// 引入样式
import "../../assets/css/normalize.less";
import "../../assets/css/reset.less";
import "../../assets/css/property.less";
import "../../assets/css/basic.less";
import "../../assets/fonts/font_kok358gumca/iconfont.css";
import "../../assets/fonts/font_iysuojan2xi/iconfont.css";

import "./sportsData.less";

import { $ } from "../../utils/dom";

// 引入echarts
import * as echarts from "echarts";

import { getExerciseReq } from "../../api/course";

/**
 * 获取运动数据
 */
const getExercise = async () => {
	let res = await getExerciseReq();
	console.log(res.data);
	let { errno, data } = res.data;
	if (errno === 0) {
		//七日运动时长的处理
		const x = data.days.map((v) => {
			return v.date.slice(6);
		});

		const y = data.days.map((v) => {
			return Math.floor(v.sumDuration / 60);
		});

		// 调用图表
		myEchartsOne(x, y);

		//运动分类数据处理


		let sportsCatgyay = [
		{
			name:"跑步",
			value: 0	
		},
		{
			name:"骑行",
			value: 0	
		},
		{
			name:"课程训练",
			value: 0	
		},
	]
		data.days.forEach((v) => {
			v.exerciseData.forEach((v1) => {
				if (v1.type === 0) {
					//跑步
					sportsCatgyay[0].value +=v1.meter
				}

				if (v1.type === 1) {
					//骑行
					sportsCatgyay[1].value +=v1.meter
				}
				if (v1.type === 2) {
					//课程训练
					sportsCatgyay[2].value +=v1.meter
				}


			});
		});

		//调用运动分类图表
		myEchartsTwo(sportsCatgyay)
	}
};
getExercise();



/**
 * 近七日运动时长
 */
function myEchartsOne(xData, yData) {
	//初始化
	const myChart = echarts.init($("#echarts1"));
	//配置图表选项

	const option = {
		title: {
			text: "近7天运动时长",
		},
		xAxis: {
			type: "category",
			data: xData,
		},
		yAxis: {
			type: "value",
		},
		series: [
			{
				data: yData,
				type: "bar",
				itemStyle: {
					color: "#83a7d1",
				},
			},
		],
	};
	myChart.setOption(option);
}
myEchartsOne();

/**
 *  运动分类
 */
function myEchartsTwo(arr) {
	//初始化
	const myChart = echarts.init($("#echarts2"));
	//配置图表选项

	const option = {
		title: {
			text: "运动分类",
			subtext: "Fake Data",
			left: "left",
		},
		//图例
		legend: {
			orient: "vertical",
			left: "left",
			top: "center",
		},

		series: [
			{
				name: "运动分类",
				type: "pie",
				radius: "50%",
				data: arr,

				//高亮样式
				emphasis: {
					itemStyle: {
						shadowBlur: 10,
						shadowOffsetX: 0,
						shadowColor: "rgba(0, 0, 0, 0.5)",
					},
				},
				// 图表中的文字标签
				label: {
					position: "inside",
					formatter: "{d}%",
				},
			},
		],
	};

	myChart.setOption(option);
	
}








